<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <title>滚滚筹-注册</title>
    <link rel="stylesheet" href="css/fb-common.min.css">
    <link rel="stylesheet" href="css/sliderBox.float.css">
    <link rel="stylesheet" href="css/jBox.css">
    <link rel="stylesheet" href="css/main.min.css">
    <link rel="stylesheet" href="css/user.min.css?a=1.0">
</head>
<body>
<div class="fb-wrap">
    <!--头部-->
    <div class="in-header-bar">
        <div class="in-head-bar">
            <div class="fb-wrap-1200 fs-16 pt-5 pb-10">
                <div class="fb-container clear">
                    <div class="in-head-login">
                        <a href="ggc-index.html">
                            <label class="logo"><img src="img/logo.png"></label>
                            <label class="logo-text">
                                <img src="img/logo-text.png">
                                <span class="fs-12 tc-333"><em class="tc-oag">785213</em>位投资人的选择</span>
                            </label>
                        </a>
                    </div>
                    <div class="in-head-nav">
                        <a class="active" href="ggc-index.html">
                            <em></em>
                            <span>首页</span>
                        </a>
                        <a href="ggc-cars-funding.html">
                            <em></em>
                            <span>汽车众筹</span>
                        </a>
                        <a href="ggc-safety-guarantee.html">
                            <em></em>
                            <span>安全保障</span>
                            <i class="fb-sprite icon-new"></i>
                        </a>
                        <a href="user-new-people.html">
                            <em></em>
                            <span>新手指引</span>
                        </a>
                        <a href="user-about-us.html">
                            <em></em>
                            <span>关于我们</span>
                        </a>
                        <a href="user-personal-center.html">
                            <em></em>
                            <span>我的账户</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--内容-->
    <div class="in-container">
        <div class="register-box">
            <div class="register-bar">
                <div class="register-step">
                    <div class="step step1 active">
                        <label class="bg">1</label>
                        <span class="tx">输入用于登陆 的手机号码</span>
                    </div>
                    <div class="step step2">
                        <label class="bg">2</label>
                        <span class="tx">验证手机号码 并设置密码</span>
                    </div>
                    <div class="step step3">
                        <label class="bg">3</label>
                        <span class="tx">完成注册</span>
                    </div>
                </div>
                <div class="register-cont">
                    <div class="step-cont active">
                        <div class="title-bar">
                            <span class="title">免费注册滚滚筹账户</span>
                            <label>已有账号？<a href="user-login.html">去登陆</a></label>
                        </div>
                        <div class="user-form mt-20">
                            <div class="item">
                                <label class="normal">
                                    <input class="verify-tel" type="text" maxlength="11" value="" placeholder="手机号码">
                                </label>
                            </div>
                            <div class="item">
                                <label class="code">
                                    <input type="text" value="" placeholder="图形验证码">
                                </label>
                                <a class="code-btn" href="javascript:;" title="点击换一换"><img src="img/code.jpg"></a>
                            </div>
                            <div class="item">
                                <div class="intro">
                                    <label class="fb-check-box active">
                                        <em>
                                            <i class="fb-sprite icon-checked"></i>
                                            <input type="checkbox" checked>
                                        </em>
                                        <span>我已同意并阅读<a id="agreement" href="javascript:;">《服务条款协议》</a></span>
                                    </label>
                                </div>
                            </div>
                            <div class="btn-bar">
                                <a class="fb-btn no-bd radius gradient tc-fff" href="javascript:;" id="nextBtn">下一步</a>
                            </div>
                        </div>
                    </div>
                    <div class="step-cont ">
                        <div class="user-form mt-20">
                            <div class="item">
                                <span class="title">手机验证码已发送至您的手机</span>
                                <label class="code">
                                    <input type="text" value="" placeholder="手机验证码">
                                </label>
                                <a id="countDown" class="cut-down" href="javascript:;">获取验证码</a>
                            </div>
                            <div class="item">
                                <label class="normal clean">
                                    <input class="clean-input" id="loginPsd" type="password" value=""
                                           placeholder="登陆密码">
                                    <a class="clean-btn" href="javascript:;">
                                        <i class="fb-sprite icon-clean"></i>
                                    </a>
                                </label>
                                <div class="password-type">
                                    <span>密码强度：</span>
                                    <label class="type text">
                                        <span class="r"><em>弱</em></span>
                                        <span class="z"><em>中</em></span>
                                        <span class="q"><em>强</em></span>
                                    </label>
                                </div>
                            </div>
                            <div class="item">
                                <label class="normal clean">
                                    <input class="clean-input" id="againPsd" type="password" value=""
                                           placeholder="再次输入您的登陆密码">
                                    <a class="clean-btn" href="javascript:;">
                                        <i class="fb-sprite icon-clean"></i>
                                    </a>
                                </label>
                            </div>
                            <div class="item">
                                <label class="normal">
                                    <input type="password" value="" placeholder="邀请码（选填）">
                                </label>
                            </div>
                            <div class="btn-bar">
                                <a class="fb-btn no-bd radius gradient tc-fff" href="javascript:;" id="sureBtn">确定</a>
                            </div>
                        </div>
                    </div>
                    <div class="step-cont ">
                        <div class="title-bar">
                            <span class="title">注册成功</span>
                            <span class="fb-block tc-333 fs-24 mt-20">恭喜获得<em class="ml-5 mr-5 tc-ff5e5e fs-24">50</em>积分，马上去认证吧！</span>
                        </div>
                        <div class="success-bar">
                            <a class="tc-user fs-16 tm-uline" href="ggc-index.html">我在看看</a>
                            <a class="tc-user fs-16 tm-uline" href="ggc-index.html">立即认证</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--底部-->
    <div class="in-footer-bar mt-0">
        <div class="fb-wrap-1200">
            <div class="footer-cont">
                <div class="footer-intro clear">
                    <div class="about-us">
                        <h2>关于我们</h2>
                        <ul>
                            <li>
                                <label>客服热线: <span>023-6281-7690</span></label>
                            </li>
                            <li>
                                <label>公司地址：重庆市南岸区烟雨路1号（大都水汇旁）</label>
                            </li>
                            <li>
                                <label>工作时间：周一到周五 09:00-18:00</label>
                            </li>
                            <li>
                                <label>服务邮箱：hzccan@qq.com</label>
                            </li>
                        </ul>
                    </div>
                    <div class="keep-us">
                        <h2>关注下载</h2>
                        <label>
                            <img src="img/icon-ewm.png">
                            <span>扫一扫关注微信公众号</span>
                        </label>
                        <label>
                            <img src="img/icon-ewm.png">
                            <span>扫一扫下载APP</span>
                        </label>
                    </div>
                    <div class="exterior-links">
                        <h2>友情链接</h2>
                        <label>
                            <a href="#">黑客帝国</a>
                            <a href="#">长江证券</a>
                            <a href="#">平安保险</a>
                            <a href="#">站长统计</a>
                        </label>
                    </div>
                </div>
            </div>
            <span class="copyright">2010-2017 版权所有 © 滚滚筹 粤ICP备16104116号-1</span>
        </div>
    </div>
</div>

<script type="text/template" id="agreementCont">
    <div class="register-agreement scrollbar">
        <p>一、重要须知</p>
        <label>1.本协议已对与您的权益具有或可能具有重大关系的条款，及对本公司具有或可能具有免责或限制责任的条款以下划线的方式标注，请您注意。在接受本协议之前，请您仔细阅读本协议的全部内容。如果您不同意本协议的任意内容，或者无法准确理解本协议任何条款的含义，请不要进行后续操作。</label>
        <label>2.您在本网站实际使用本协议约定的服务（以下简称“本服务”）前，您已认真阅读、充分理解并完全接受本协议的全部内容，一旦您点击“同意”按钮，即表示您承诺遵循本协议之所有约定。</label>
        <label>3.您同意，本网站有权随时对本协议内容进行单方面的修改，并以在本网站公告的方式予以公布，无需另行单独通知您；若您在本协议内容公告修改后继续使用本服务的，表示您已认真阅读、充分理解并完全接受修改后的协议内容，也将遵循修改后的协议内容使用本服务；若您不同意修改后的协议内容，或者无法准确理解修改后的协议中任何条款的含义，您应停止使用本服务。</label>
        <label>4.您保证，在您同意接受本协议时，您是持有中国大陆有效身份证件或持有港澳居民来往内地通行证、台湾居民来往大陆通行证的年满 18
            周岁以上的具有完全民事行为能力的自然人或经主管机关核准登记、能够独立承担民事责任的企业法人。不具备前述条件的，您应立即停止使用本服务。</label>
        <label>5.您应当向本网站准确提供您的电子邮件地址、联系电话、联系地址、邮政编码等联系方式，以便本网站将该项目的相关信息发送给您。您有义务保持您提供的联系方式的有效性。如有需要变更更新的，您应及时进行更新。您应完全独自承
            担因通过这些联系方式无法将相关信息发送给您而导致的您在使用本服务过程中遭受的任何损失或增加任何费用等不利后果。</label>
        <label>6.因本网站需要对您进行实名认证，如您未及时更新资料（包括但不限于姓名、身份证号、港澳居民来往内地通行证、台湾居民来往大陆通行证等证件或其他身份证明文件），导致本
            务无法提供或提供时发生任何错误等，您将承担因此产生的一切后果，本网站不承担任何责任。</label>
        <label>7.您确认，只有您本人可以使用您的 “滚滚筹”网站注册账户，您不会将您的网站注册账户转让给第三方或者授权给第三方使用。除非另有法律规定或经司法裁判，且征得本网站同意
            否则您的网站注册账户、登录名及密码不得以任何方式转让、赠与或继承（相关的财产权益除外）。 您确认，任何第三方使用您的用户名和密码登陆本网站后在本网站的一切行为均代表
            您的意思表示并由您承担相应的法律后果。在您决定不再使用您的网站注册账户时，您应按照本网站的相关规定向本网站申请注销。</label>
        <label>8.您同意，若您丧失全部或部分民事权利能力或民事行为能力，本网站有权根据有效法律文书（包括但不限于生效的法院判决、生效的遗嘱等）或本网站认可的其他资料协助相关机构
            行为均代表您的意思表示并由您承担相应的法律后果。在您决定不再使用您的网站注册账户时，您应按照本网站的相关规定向本网站申请注销。</label>
    </div>
</script>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/jquery.jbox.js"></script>
<script src="js/fb-common.js"></script>
<script src="js/fb-page.js"></script>
<script>
    $(function () {
        //设置弹窗的高度
        var box_height = 0;
        FB.resizeFun(function (w, h) {
            box_height = h - h * 0.1 * 2;
        });
        //配置弹窗
        $.jBox.configFun(function (opt) {
            opt.isVertical = false;
        });

        //选择协议
        formChecked(".fb-check-box");
        //弹出协议
        $("#agreement").click(function () {
            var text = $("#agreementCont").html();
            var title = "滚滚筹服务协议";
            $.jBox.btnAlert(text, {
                boxCls: "agreement-box",
                title: title,
                top: "10%",
                btn: {
                    text: ["同意协议，马上去注册"]
                }
            }, {
                boxCSS: {
                    width: "900px",
                    height: box_height + "px"
                },
                contCSS: {
                    height: box_height - 48 - 30 + "px"
                },
                textBoxCSS: {
                    height: box_height - 48 - 30 - 40 - 15 + "px"
                }
            });
        });

        //注册流程
        $("#nextBtn").click(function () {
            var boxOpt = {isVertical: false};
            var $step_num = $(".step");
            var $step = $(".step-cont");
            var tel = $(".verify-tel");
            var val = tel.val();
            if (FB.testForm.phone(val) == 0) {
                $.jBox.alert("手机号不能为空", boxOpt);
            } else if (FB.testForm.phone(val) == 3) {
                $.jBox.alert("手机号格式错误", boxOpt);
            } else if (FB.testForm.phone(val) == 2) {
                $step_num.eq(1).addClass("active");
                $step.eq(1).addClass("active").siblings().removeClass("active");
                //验证码倒计时开始
                $("#countDown").click();
            }
        });

        //绑定倒计时
        var countTime = "";
        if (countTime) countTime.stopTimeFun();
        $(document).on("click", "#countDown", function () {
            if ($(this).hasClass("active")) return false;
            var time = 120;
            countTime = new FB.countDown(this, time, ["获取验证码", " 秒后重新获取"], function () {
                console.log("倒计时结束")
            });
        });

        //密码验证
        verifyPwd("#loginPsd", "#againPsd");

        //清除文字
        $(".clean-input").focus(function () {
            $(this).next().show();
        }).blur(function () {
            if(!$(this).val()) {
                $(this).next().hide();
            }
        });
        $(".clean-btn").each(function () {
            clearText(this, $(this).prev());
        });

        //确定
        $("#sureBtn").click(function(){
            if($(".error").length==0){
                var $step_num = $(".step");
                var $step = $(".step-cont");
                $step_num.eq(2).addClass("active");
                $step.eq(2).addClass("active").siblings().removeClass("active");
            }
        });
    })
</script>
</body>
</html>